<template>
  <div>

    <el-form ref="editForm" :model="formFileds">
      <el-row :gutter="24">
        <!--        <el-col :span="12">-->
        <!--          <el-form-item>-->
        <!--            <el-input v-model="formFileds.text"></el-input>-->
        <!--          </el-form-item>-->
        <!--        </el-col>-->
        <!--        <el-col :span="2">-->
        <!--          <el-form-item>-->
        <!--            <el-button type="primary" @click="onSubmit">查询-->
        <!--            </el-button>-->
        <!--          </el-form-item>-->
        <!--        </el-col>-->
        <!--        <el-col :span="2">-->
        <!--          <el-form-item>-->
        <!--            <el-button type="primary" @click="add">增加-->
        <!--            </el-button>-->
        <!--          </el-form-item>-->
        <!--        </el-col>-->

      </el-row>
    </el-form>

    <!--表格内容-->
    <el-table ref="list" :data="tableData" style="width: 100%; margin-bottom: 5px;" border stripe
              highlight-current-row :default-sort="{prop: 'date', order: 'descending'}" @row-click="handleRowClick"
              @select-all="handleCheckedAllAndCheckedNone" @select="handleCheckedAllAndCheckedNone"
              :header-cell-style="{textAlign:'center'}" :cell-style="{textAlign:'center'}">
      <el-table-column property="message" label="内容">
      </el-table-column>
      <el-table-column property="time" label="时间">
      </el-table-column>
      <el-table-column label="操作" width="150px">
        <template slot-scope="scope">
          <el-button circle icon="el-icon-delete" type="danger" title="删除消息" size="small"
                     @click="rowDel( scope.row);"></el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import {delList, delMessage, getMessage} from '../../api/personalCenter/personalCenter';

export default {
  name: "message",
  components: {

  },
  data(){
    return{
      formFileds:{},
      tableData:[
        {
          id: '',
          message: '',
          rank: '',
          time: '',
          userid: '',
          username: ''
        }
      ],
      mine: [],
    }
  },
  methods:{
    getMessage(){
      this.param = 'userid=' + '2';
      getMessage(this.param).then((res) => {
        if(res){
          // console.log(res.data);
          console.log(res);
          this.total = res.data.total;
          this.tableData = res.data;
          console.log(res.data);
          console.log(this.tableData);
          console.log('00:' + this.tableData[1].message);
        }
      });
    },

    rowDel(row) {
      console.log(row.id);
      // 让当前删除按钮失焦
      // event.target.blur();
      this.$confirm('确定删除吗？', '取消', {
        comfirmButtonText: '确定',
        cancelButtonText: '取消'
      }).then(() => {
        // let data = {
        //   id: row.id
        // }
        // console.log(data);
        let id = row.id;
        this.param = 'id=' + id ;
        delMessage(this.param).then((res) => {
          if(res){
            console.log(res);
            this.tableData.splice(row.id, 1);
            this.$message.success('删除成功');
            this.getMessage();
          }
        })
      });
    },

  },
  //页面加载
  mounted(){
    this.getMessage();
  }
}
</script>

<style scoped>

</style>